@layout("/common/_container.html"){
<style>
    .btnBox button {
        background: #30add1;
        color: white;
        border:1px solid #999999;
    }
    .templateStyle{
        background: #30add1;
        color: white;
        padding: 2px;
    }
</style>
<div>
    <div class="ibox-content" style="height: 100%;">
        <div style="height: 100%;">
            <div id="templateBox">
                <ul style="padding-left: 20px;">
                    <li>
                        <span style="color: #00A8CB" class="glyphicon glyphicon-folder-open"></span>
                        <span>我的模板</span>
                    </li>
                    @for(item in obloginfo){
                    <li class="oneClass" style="margin: 5px 0;">
                        <span style="color: #00A8CB" class="glyphicon glyphicon-plus-sign"></span>
                        <span style="color: #00A8CB;display: none" class="glyphicon glyphicon-minus-sign"></span>
                        <span>${item.oneClass}</span>
                        <ul style="display: none;padding-left: 27px;">
                            @for(str in item.ci){
                            <li class="twoClass" style="margin: 3px 0;">
                                <span style="color: #00A8CB" class="glyphicon glyphicon-folder-open"></span>
                                <span id="${str.id}">${str.twoClass}</span>
                            </li>
                            @}
                        </ul>
                    </li>
                    @}
                </ul>
            </div>
        </div>
    </div>
    <div style="position: absolute;bottom: 0;width: 100%;background: #efefef;padding: 5px 15px;">
        <div class="btnBox" style="text-align: right">
            <button type="button" class="btn" style="background: white;color: #333333" onclick="parent.layer.close(parent.layer.getFrameIndex(window.name))">取消</button>
            <button type="button" class="btn" onclick="templatePreservation()">确定</button>
        </div>
    </div>
</div>
<script>
    $("#templateBox").on('click','.oneClass',function () {
        $(this).children('.glyphicon-plus-sign').toggle();
        $(this).children('.glyphicon-minus-sign').toggle();
        $(this).children('ul').toggle();
    });

    $("#templateBox").on('click','.twoClass span',function (e) {
        e.stopPropagation();
        $("span").removeClass('templateStyle');
        $(this).addClass('templateStyle');
    });

    templatePreservation = function () {
        var id = $(".templateStyle").attr('id');
        var text = $(".templateStyle").html();
        var texts = $(".templateStyle").parent().parent().prev().html();
        window.parent.document.getElementById("idValue").value = id;
        window.parent.document.getElementById("templateCategory").innerHTML = texts + " > " + text;
        parent.layer.close(parent.layer.getFrameIndex(window.name))
    }
</script>
@}
